<html xmlns:th="http://www.thymeleaf.org">
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>更新账单</title>
    <th:block th:include="include :: header('日期和时间')" />
    <th:block th:include="include :: datetimepicker-css" />
    <style>
        .button {
            background-color: #4CAF50; /* Green */
            border: none;
            color: white;
            padding: 10px 20px;
            text-align: center;
            text-decoration: none;
            display: inline-block;
            font-size: 16px;
            margin: 4px 2px;
            -webkit-transition-duration: 0.4s; /* Safari */
            transition-duration: 0.4s;
            cursor: pointer;
        }

        .save {
            background-color: white;
            color: black;
            border: 2px solid #008CBA;
        }

        .save:hover {
            background-color: #008CBA;
            color: white;
        }
    </style>
</head>
<body class="gray-bg">
<h3 style="margin: 10px">
    <button id="index"  onclick="index()" class="btn btn-info">返回首页</button>
</h3>
<form id="saveBill" action="/bill/do/update" method="post" th:object="${bill}">
    <table style="border-collapse:separate; border-spacing:0px 10px;">
        <tr>
            <td style="text-align:center;">
                <label><span class="c-red">*</span>方式：</label>
            </td>
            <td>
                <div>
                    <select th:name="mode" lay-search="" class="form-control input1" >
                        &lt;!&ndash;<option value="modeId">请选择</option>&ndash;&gt;
                        <option th:each="item:${modeList}"
                                th:value="${item.modeId}"
                                th:text="${item.modeName}"
                            th:selected="${item.modeId}+''==*{mode}">
                        </option>
                    </select>
                </div>
            </td>
        </tr>
        <tr>
            <td style="text-align:center;">
                <label><span class="c-red">*</span>类型：</label>
            </td>
            <td>
                <div>
                    <select th:name="type" lay-search="" class="form-control input2" >
                        &lt;!&ndash;<option value="modeId">请选择</option>&ndash;&gt;
                        <option th:each="item:${typeList}"
                                th:value="${item.typeId}"
                                th:text="${item.typeName}"
                                th:selected="${item.typeId}+''==*{type}">
                        </option>
                    </select>
                </div>
            </td>
        </tr>
        <tr>
            <td style="text-align:center;">
                <label><span class="c-red">*</span>金额：</label>
            </td>
            <td>
                <div>
                    <input style="height: 30px; width: 260px; line-height: 29px; padding-top: 0px;"
                           maxlength="100" th:name="money" th:value="*{money}"/>
                </div>
            </td>
        </tr>
        <tr>
            <td style="text-align:center;">
                <label><span class="c-red">*</span>日期：</label>
            </td>
            <td>
                <div class="input-group date form_date2">
                    <span class="input-group-addon"><i class="fa fa-calendar"></i></span>
                    <input type="text" th:name="date" th:value="*{date}" class="form-control" id="date" placeholder="yyyy-MM-dd" readonly>
                    <span class="input-group-addon"><span class="glyphicon glyphicon-remove"></span></span>
                </div>
            </td>
        </tr>
        <tr>
            <td style="text-align:center;">
                <label><span class="c-red">*</span>来源：</label>
            </td>
            <td>
                <!--<input style="height: 30px; width: 260px; line-height: 29px; padding-top: 0px;"
                       maxlength="100" th:name="form" th:value="*{form}"/>-->


                <div>
                    <select th:name="form" lay-search="" class="form-control input1" >
                        &lt;!&ndash;<option value="formId">请选择</option>&ndash;&gt;
                        <option th:each="source:${sourceList}"
                                th:value="${source.formId}"
                                th:text="${source.formName}"
                                th:selected="${source.formId}+''==*{form}">
                        </option>
                    </select>
                </div>

            </td>
        </tr>
        <tr>
            <td style="text-align:center;">
                <label><span class="c-red">*</span>去向：</label>
            </td>
            <td>
                <input style="height: 30px; width: 260px; line-height: 29px; padding-top: 0px;"
                       maxlength="100" th:name="to" th:value="*{to}"/>
            </td>
        </tr>
        <tr>
            <td style="text-align:center;">
                <label><span class="c-red">*</span>备注：</label>
            </td>
            <td>
                <input style="height: 30px; width: 260px; line-height: 29px; padding-top: 0px;"
                       maxlength="100" th:name="remark" th:value="*{remark}"/><br/>
            </td>
        </tr>
        <tr>
            <td style="text-align:center;">
                <label><span class="c-red">*</span>支付时间:</label>
            </td>
            <td>
                <div class="input-group date form_date">
                    <span class="input-group-addon"><i class="fa fa-calendar"></i></span>
                    <input type="text" th:name="payTime" th:value="${#dates.format(bill.payTime,'yyyy-MM-dd HH:mm:ss')}" 
                           class="form-control">
                    <span class="input-group-addon"><span class="glyphicon glyphicon-remove"></span></span>
                </div>
            </td>
        </tr>
        <tr>
            <input type="hidden" name="recordId" th:value="*{recordId}">
            <td colspan="2" style="text-align: center;">
                <button class="button save">保存</button>
            </td>
        </tr>
    </table>
</form>
<th:block th:include="include :: footer" />
<th:block th:include="include :: datetimepicker-js"/>
<script type="text/javascript">
    $(function(){
        $(".form_date2").datetimepicker({
            format: "yyyy-mm-dd",
            minView: "month",
            autoclose: true
        });
        $(".form_date").datetimepicker({
            format: "yyyy-mm-dd hh:ii:ss",
            autoclose: true
        });
    });
    function index(){
        location.href="/bill/to/index";
    }
</script>
</body>
</html>
